<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
	 <input type="hidden" name="file_url" id="file_url" value="">
 <input type="file" id="video" onchange="uploadfile(1)" multiple="multiple" accept="video/*"/>
  <input type="file" id="file" onchange="uploadfile(2)" multiple="multiple" accept=".xls,.doc,.txt,.pdf"/>
</body>
</html>
<script type="text/javascript">
	 var xhr = null;//xhr对象
        function uploadfile(type){
            const LENGTH = 1024 * 1024 * 10;//每次上传的大小
            $("#file_url").val('');//清空数据
            let fileobj=null;
            //获取文件对象
            if(type==1)
                 fileobj=document.getElementById('video');
            else
                 fileobj=document.getElementById('file');
            for(let i=0;i<fileobj.files.length;i++){
                let file = fileobj.files[i];//文件对象
                let tempname=new Date().getTime()+RandomString(8)+"."+getFileType(file.name);
                let totalSize = file.size;//文件总大小
                let start = 0;//每次上传的开始字节
                let end = start + LENGTH;//每次上传的结尾字节
                let fd = null//创建表单数据对象
                let blob = null;//二进制对象
                while(start < totalSize){
                    fd = new FormData();//每一次需要重新创建
                    xhr = new XMLHttpRequest();//需要每次创建并设置参数
                    xhr.open('POST','/admin/courseware/upload?&foldername=courseware&filename='+tempname,true);
                    xhr.onreadystatechange=state_Change;
                    xhr.upload.onprogress = progressFunction;//【上传进度调用方法实现】
                    xhr.upload.onloadstart = function(){//上传开始执行方法
                        ot = new Date().getTime();   //设置上传开始时间
                        oloaded = 0;//设置上传开始时，以上传的文件大小为0
                    };
                    blob = file.slice(start,end);//根据长度截取每次需要上传的数据
                    fd.append('video',blob);//添加数据到fd对象中
                    xhr.send(fd);//将fd数据上传
                    //重新设置开始和结尾
                    start = end;
                    end = start + LENGTH;
                }
            }
        }
        function getFileType(filePath) {
            let startIndex = filePath.lastIndexOf(".");
            if (startIndex != -1)
                return filePath.substring(startIndex + 1, filePath.length).toLowerCase();
            else return "";
        }

        function RandomString(length) {
            let str = '';
            for ( ; str.length < length; str += Math.random().toString(36).substr(2) );
            return str.substr(0, length);
        }

        function state_Change() {
            if (xhr.readyState==4)
            {// 4 = "loaded"
                if (xhr.status==200)
                {// 200 = "OK"
                    // console.log(xhr.status);
                    // console.log(xhr.statusText);
                    // console.log(xhr.responseText);
                    let file_url = $("#file_url").val();
                    if(!file_url)
                        $("#file_url").val(xhr.responseText);
                    else
                        $("#file_url").val(file_url+","+xhr.responseText);
                }
                else
                {
                    // console.log("Problem retrieving XML data:" + xhr.statusText);
                }
            }
        }

        let ot;
        let oloaded;
        //上传进度实现方法，上传过程中会频繁调用该方法
        function progressFunction(evt) {

            let progressBar = document.getElementById("progressBar");
            let percentageDiv = document.getElementById("percentage");
            // event.total是需要传输的总字节，event.loaded是已经传输的字节。如果event.lengthComputable不为真，则event.total等于0
            if (evt.lengthComputable) {//
                progressBar.max = evt.total;
                progressBar.value = evt.loaded;
                percentageDiv.innerHTML = Math.round(evt.loaded / evt.total * 100) + "%";
            }

            let time = document.getElementById("time");
            let nt = new Date().getTime();//获取当前时间
            let pertime = (nt-ot)/1000; //计算出上次调用该方法时到现在的时间差，单位为s
            ot = new Date().getTime(); //重新赋值时间，用于下次计算

            let perload = evt.loaded - oloaded; //计算该分段上传的文件大小，单位b
            oloaded = evt.loaded;//重新赋值已上传文件大小，用以下次计算

            //上传速度计算
            let speed = perload/pertime;//单位b/s
            let bspeed = speed;
            let units = 'b/s';//单位名称
            if(speed/1024>1){
                speed = speed/1024;
                units = 'k/s';
            }
            if(speed/1024>1){
                speed = speed/1024;
                units = 'M/s';
            }
            speed = speed.toFixed(1);
            //剩余时间
            let resttime = ((evt.total-evt.loaded)/bspeed).toFixed(1);
            time.innerHTML = '，速度：'+speed+units+'，剩余时间：'+resttime+'s';
            // if(bspeed==0)
            //     time.innerHTML = '上传已取消';
        }
</script>